<html>
<head>
    <meta charset="utf-8">
    <title>商品编辑</title>
    <#assign base=request.contextPath  />
    <#setting  number_format="0.##"/>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="${base}/backstage/layui/css/layui.css" media="all">
    <script src="${base}/sweep/js/mui.min.js"></script>
    <script src="${base}/backstage/layui/layui.js"></script>
    <script src="${base}/backstage/wangEdit/wangEditor.js"></script>
    <script src="${base}/backstage/js/jquery-1.8.3.min.js"></script>
    <script>
        var base =  "${base}";
    </script>
    <script src="${base}/backstage/js/ipNameUrl.js"></script>
</head>
<body>
<form class="layui-form " action="" style="padding-left: 15px;">
    <input type="hidden" value="${good.id}" id="id"/>
<br>
<br>
    <div class="layui-upload" style="position: relative;left:7%;width: 93%">
        <button type="button" class="layui-btn" id="test2">上传商品图片</button>
        <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
            预览图：
            <div class="layui-upload-list" id="demo2">
                <#list goodImage as goodImage>
                    <img src="${goodImage.url}" style="width: 200px;height: 200px">
                </#list>
            </div>
        </blockquote>
    </div>
    <br>
    <br>
    <div class="layui-form-item">
        <label class="layui-form-label">暂定单价</label>
        <div class="layui-input-block">
            <input class="layui-input" value="${good.provisionalPrice}" name="provisionalPrice" onchange="zan(this.id)" id="provisionalPrice" placeholder="请输入暂定商品单价,如是整数 20.00" autocomplete="off">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">商品名称</label>
        <div class="layui-input-block">
            <input class="layui-input" value="${good.goodName}" name="goodName" id="goodName" placeholder="请输入商品名称" autocomplete="off">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">商品来源</label>
        <div class="layui-input-block">
            <input class="layui-input" name="source" value="${good.source}" id="source" placeholder="请输入商品来源" autocomplete="off">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">来源链接</label>
        <div class="layui-input-block">
            <input class="layui-input" name="url" value="${good.url}" id="url" placeholder="请输入商品来源链接" autocomplete="off">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">商品盈利</label>
        <div class="layui-input-block">
            <input class="layui-input" value="${good.profit}" name="profit" id="profit" disabled value="商品盈利是暂定商品单价的15%" autocomplete="off">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">销售盈利</label>
        <div class="layui-input-block">
            <input class="layui-input" name="saleProfit" value="${good.saleProfit}" id="saleProfit" disabled value="销售盈利是暂定商品单价的8%" autocomplete="off">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">商品单价</label>
        <div class="layui-input-block">
            <input class="layui-input" value="${good.goodPrice}" disabled name="goodPrice" id="goodPrice"  placeholder="请输入商品单价" autocomplete="off">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">商品分类</label>
        <div class="layui-input-block">
            <select name="modules" id="commodityId" lay-verify="required" lay-search="" lay-filter="commodityId">
                <option value="">直接选择商品分类</option>
                <#list commodityClassification as commodityClassification>
                    <option value="${commodityClassification.id}">${commodityClassification.name}</option>
                </#list>

            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">分类名称</label>
        <div class="layui-input-block">
            <select name="modules" id="classificationId" lay-verify="required" lay-search="">
                <option value="">直接选择分类名称</option>
                <#list classification as classification>
                    <option value="${classification.id}">${classification.name}</option>
                </#list>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">是否包邮</label>
        <div class="layui-input-block">
            <select name="modules" id="freeShipping" lay-verify="required" lay-search="">
                <option value="1">是</option>
                <option value="2">否</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">是否下架</label>
        <div class="layui-input-block">
            <select name="modules" id="businesses" lay-verify="required" lay-search="">
                <option value="1">是</option>
                <option value="2">否</option>
            </select>
        </div>
    </div>
<br>
<br>
    <div class="layui-upload"  style="position: relative;left:7%;width: 93%">
        <button type="button" class="layui-btn" id="test3">上传商品详情</button>
        <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
            预览图：
            <div class="layui-upload-list" id="demo3">
                <#list goodDetails as goodDetails>
                    <img src="${goodDetails.url}" style="width: 200px;height: 200px">
                </#list>
            </div>
        </blockquote>
    </div>
    <br>
    <br>
    <div class="layui-form-item">
        <label class="layui-form-label">商品描述</label>
        <div class="layui-input-block">
            <textarea class="layui-input" name="goodContent" id="goodContent" style="height: 100px" placeholder="请输入商品描述" autocomplete="off">${good.goodContent}</textarea>
        </div>
    </div>

<br>
<br>
    <div align="center">
        <button type="button" class="layui-btn" id="saveButton">保存</button>
        <button type="button" class="layui-btn" onclick="window.history.back(-1);">返回</button>
    </div>
    <br>
    <br>
</form>

</body>
<script>
    var goodImage = "";
    var goodDetails = "";
    layui.use(['form', 'layer', 'upload'], function () {
        var form = layui.form
            , layer = layui.layer
            , $ = layui.jquery
            , upload = layui.upload;

        $.ajax({
            type: "GET",
            url: "${base}/admin/public/selectGood",
            dataType: "json",
            data:{id:$("#id").val()},
            success: function (data) {
                if(data.code==200){
                    $("#commodityId option[value='" + data.data.commodityId + "']").attr("selected", "selected");
                    $("#classificationId option[value='" + data.data.classificationId + "']").attr("selected", "selected");
                    $("#freeShipping option[value='" + data.data.freeShipping + "']").attr("selected", "selected");
                    $("#businesses option[value='" + data.data.businesses + "']").attr("selected", "selected");
                    layui.form.render(); //更新全部
                }
            }
        });


        layui.form.on('select(commodityId)', function(data) {
            var commodityId =  data.value;
            $.ajax({
                type: "GET",
                url: "${base}/admin/public/selectClassifitcation",
                dataType: "json",
                data:{id:commodityId},
                success: function (data) {
                    if(data.code==200){
                        $("#classificationId").html("")
                        $("#classificationId").append(
                            ' <option value=""  >直接选择分类名称</option>'
                        )
                        for (var i = 0; i < data.data.length; i++) {
                            $("#classificationId").append(
                                ' <option value="' + data.data[i].id+ '"  >' + data.data[i].name + '</option>'
                            )
                        }
                        layui.form.render(); //更新全部
                    }
                }
            });
        });
        var loadIndex;
        //多图片下传
        upload.render({
            elem: '#test2'
            ,url: '${base}/admin/file/uploadFile' //改成您自己的下传接口
            ,multiple: true
            ,before: function(obj){
                loadIndex = layer.load(3, { shade: [0.5, '#696969'],offset: ['50%', "50%"] });
                //预读本地文件示例，不支持ie8
                $("#demo2").html("")
                obj.preview(function(index, file, result){

                    $('#demo2').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img" style="width: 200px;height: 200px">')
                });
            }
            ,done: function(res){
                layer.closeAll('loading'); //关闭loading
                goodImage+=res.data+";";
                //上传完毕
            }
        });
        upload.render({
            elem: '#test3'
            ,url: '${base}/admin/file/uploadFile' //改成您自己的下传接口
            ,multiple: true
            ,before: function(obj){
                loadIndex = layer.load(3, { shade: [0.5, '#696969'],offset: ['50%', "50%"] });
                //预读本地文件示例，不支持ie8
                $("#demo3").html("")
                obj.preview(function(index, file, result){

                    $('#demo3').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img" style="width: 200px;height: 200px">')
                });
            }
            ,done: function(res){
                layer.closeAll('loading'); //关闭loading
                goodDetails+=res.data+";";
                //上传完毕
            }
        });


    })

    function zan(id){
        //判断是否是小数
        var regex=/^\d+\.\d+$/;
        if (regex.test($("#provisionalPrice").val())==false) {
            layer.msg("暂定商品单价为小数！")
            return;
        }
        if($("#provisionalPrice").val()==""){
            layer.msg("请先填暂定单价")
            $("#goodPrice").val("");
            return
        }else{
            var provisionalPrice = $("#"+id+"").val();
            if(provisionalPrice!=""){
                //计算商品单价
                var fei = parseFloat(provisionalPrice)*parseFloat(0.15);
                var profit = fei.toFixed(2);
                $("#profit").val(profit);
                var goodPrice = parseFloat(provisionalPrice)+parseFloat(profit);
                $("#goodPrice").val(goodPrice.toFixed(2));
            }
        }
    }

    $("#saveButton").on("click", function () {


        // if(goodImage==""){
        //     layer.msg("请下传商品图片！")
        //     return;
        // }
        if ($("#goodName").val()=="") {
            layer.msg("请填写商品名称！")
            return;
        }
        if ($("#source").val()=="") {
            layer.msg("请填写商品来源！")
            return;
        }
        if ($("#goodPrice").val()=="") {
            layer.msg("请填写商品单价！")
            return;
        }
        var regex=/^\d+\.\d+$/;
        if (regex.test($("#goodPrice").val())==false) {
            layer.msg("商品单价为小数！")
            return;
        }
        if ($("#commodityId").val()=="") {
            layer.msg("请填写商品分类！")
            return;
        }
        if ($("#classificationId").val()=="") {
            layer.msg("请填写分类名称！")
            return;
        }
        // if(goodDetails==""){
        //     layer.msg("请下传商品详情！")
        //     return;
        // }
        if ($("#goodContent").val()=="") {
            layer.msg("请填写商品描述！")
            return;
        }
        var formDate = {
            goodName: $("#goodName").val(),
            source: $("#source").val(),
            // url: $("#url").val(),
            goodPrice: $("#goodPrice").val(),
            commodityId: $("#commodityId").val(),
            classificationId: $("#classificationId").val(),
            goodContent: $("#goodContent").val(),
            profit: $("#profit").val(),
            freeShipping: $("#freeShipping").val(),
            provisionalPrice: $("#provisionalPrice").val(),
            businesses: $("#businesses").val(),
            saleProfit: $("#saleProfit").val(),
            id: $("#id").val()
        }

        var image = "";
        if(goodImage!=""){
            image =goodImage
        }else{
            image = "";
        }
        var details = "";
        if(goodDetails!=""){
            details =goodDetails
        }else{
            details = "";
        }
        $.ajax({
            type: "POST",
            url: "${base}/admin/good/updateById",
            data: {param:JSON.stringify(formDate),goodImage:goodImage,goodDetails:goodDetails},
            success: function (data) {
                if (data.code === 200) {
                    layer.msg(data.msg)
                    window.location.href = "${base}/admin/good/good.html"
                } else {
                    layer.msg(data.msg)
                }
            }
        });
    })
</script>
</html>


